<template>
  <div class="contentShadow">
    <el-container>
      <el-header>
        <h1>学生信息表</h1>
      </el-header>
      <el-main>
        <el-form ref="form" :model="studentInformation" label-width="100px">
          <el-form-item label="学号" prop="studentId">
            <el-input v-model="studentInformation.studentId" disabled="disabled"></el-input>
          </el-form-item>
          <el-form-item label="姓名" prop="name">
            <el-input v-model="studentInformation.name" disabled="disabled"></el-input>
          </el-form-item>
          <el-form-item label="性别" prop="gender">
            <el-radio-group v-model="studentInformation.gender" disabled="disabled">
              <el-radio label="1">男</el-radio>
              <el-radio label="0">女</el-radio>
            </el-radio-group>
          </el-form-item>
          <el-form-item label="级别" prop="major">
            <el-input v-model="studentInformation.grade" disabled="disabled"></el-input>
          </el-form-item>
          <el-form-item label="专业" prop="major">
            <el-input v-model="studentInformation.major" disabled="disabled"></el-input>
          </el-form-item>
          <el-form-item label="学苑" prop="class">
            <el-input v-model="studentInformation.class" disabled="disabled"></el-input>
          </el-form-item>
          <el-form-item label="导师" prop="mentorId">
            <el-input v-model="studentInformation.mentor" disabled="disabled"></el-input>
          </el-form-item>
        </el-form>
        <el-button type="primary" @click="submitForm" disabled="disabled">提交</el-button>
        <el-button @click="resetForm" disabled="disabled">重置</el-button>
        <el-button type="danger" @click="open">申诉</el-button>
      </el-main>
    </el-container>
  </div>
</template>

<script>
import {getStudentInformation} from "@/api/student";

export default {
  name: "AddUser",
  data() {
    return {
      studentInformation: {
        studentId: "",
        name: "",
        gender: "",
        grade: "",
        major: "",
        class: "",
        mentor: "",
      }
    };
  },
  mounted() {
    getStudentInformation().then((res) => {
      // console.log(res.data);
      this.studentInformation.studentId = res.data.studentId;
      this.studentInformation.name = res.data.name;
      this.studentInformation.gender = res.data.gender.toString();
      this.studentInformation.grade = res.data.grade;
      this.studentInformation.major = res.data.majorName + '(' + res.data.majorCode + ')';
      this.studentInformation.class = res.data.className;
      this.studentInformation.mentor = res.data.mentorName + '(' + res.data.jobId + ')';
    });
  },
  methods: {
    submitForm() {
      this.$refs.form.validate(valid => {
        if (valid) {
          // TODO: send user data to backend
          console.log(this.user);
        } else {
          console.log("form validation failed");
        }
      });
    },
    resetForm() {
      this.$refs.form.resetFields();
    },
    open() {
      this.$prompt('请输入申诉信息，拖动输入框右下角可调节大小', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        inputType: 'textarea'
      }).then(({value}) => {
        this.$message({
          type: 'success',
          message: '发送成功，请耐心等待'
        });
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '取消输入'
        });
      });
    }
  },
};
</script>

<style>

</style>
